<template>
	<view class="myAddress">
		<view class="main">
			<scroll-view scroll-y class="srx">
				<view class="list" v-if="list.length">
					<view class="item" v-for="(item, index) in list" :key="index" @click="selectAddress(item)">
						<view class="o-t">
							<view>{{item.name}}</view>
							<view>{{ item.mobile }}</view>
						</view>
						<view class="o-a">{{item.pca}} {{item.address}}</view>
						<view class="o-d">
							<view @click.stop="setDef(item)">
								<view :class="{ act: item.isDefault }"></view>
								<view>设为默认</view>
							</view>
							<view>
								<view @click.stop="LinkTo(item)">编辑</view>
								<view @click.stop="delAddr(item)">删除</view>
							</view>
						</view>
					</view>
				</view>
				<view class="nodata flex_center" v-else>
					~暂无数据~
				</view>
			</scroll-view>
		</view>
		<view class="add" @click="$go('./addAddress')">
			新增收货地址
		</view>
	</view>
</template>

<script>
	export default {
		name: 'myAddress',
		data() {
			return {
				type: "",
				list: [],
				params: {
					// uname: '',
					// ticket: '',
					// user_id: ''
				}
			}
		},
		onLoad(option) {
			this.type = option.type
		},
		onShow() {
			this.getlist()
		},
		methods: {
			getlist(){
				this.$ajax('api/Member/QueryAddress').then(res => {
					this.list = res.Data.list
				})
			},
			setDef(item){
				this.$ajax('api/Member/IsDefault',{id:item.id}).then(res =>{
					if(res.RequestStatus == 200){
						uni.showToast({
							title:'设置成功'
						})
						this.getlist()
					}
				})
			},
			selectAddress(item){
				if(this.type == 1){
					uni.$emit('submitAddress',item)
					uni.navigateBack({
						
					})
				}
			},
			LinkTo(item){
				uni.navigateTo({
					url:'./addAddress?editForm='+JSON.stringify(item)
				})
			},
			delAddr(item){
				let that = this
				uni.showModal({
					title: '警告',
					content: '确定删除该条信息？',
					showCancel: true,
					cancelText: '取消',
					confirmText: '确定',
					success: res => {
						if(res.confirm){
							that.$ajax('api/Member/Delete',{id:item.id}).then(ccc => {
								console.log(ccc)
								that.getlist()
							})
						}
					},
					fail: () => {},
					complete: () => {}
				});
			}
		},
		computed: {
		},
	}
</script>

<style lang="scss">
	// @import '../../common/css/variables.less'; 
	.nodata{
		font-size: 25rpx;
		color: #888;
		margin: 200rpx 0 auto;
	}
	uni-page-body,
	page {
		height: 100%;
	}

	.myAddress {
		height: 100%;
		overflow: hidden;
		display: flex;
		flex-flow: column;
		flex-direction: column;
		background: #EAEAEC;
		view {
			line-height: 1.4;
		}

		.main {
			flex: 1;
			overflow: hidden;

			.srx {
				height: 100%;

				.list {
					background-color: f6f6f6;

					.item {
						padding: 0 15px;
						color: #333;
						background: white;
						margin-bottom: 30rpx;
						margin-top: 1px;
						&>view {
							font-size: 26rpx;
						}

						.o-t,
						.o-a,
						.o-d {
							display: flex;
							justify-content: space-between;
							padding: 15rpx 0;
						}

						.o-a {
							position: relative;
							padding-top: 0;

							&::after {
								content: '';
								position: absolute;
								bottom: 0;
								left: -15px;
								width: calc(100% + 30px);
								border-top: 1px solid #f9f9f9;
							}
						}

						.o-d {
							&>view {
								&:first-of-type {
									display: flex;
									justify-content: space-between;
									align-items: center;

									&>view {
										&:first-of-type {
											width: 35rpx;
											height: 35rpx;
											border: 1px solid #e3e3e3;
											border-radius: 50%;
											box-sizing: border-box;
											margin-right: 15rpx;

											&.act {
												background: #ec0000;
												border-color: #ec0000;
												position: relative;

												&::after {
													position: absolute;
													content: '\393';
													top: 0;
													left: 0;
													width: 100%;
													height: 100%;
													color: white;
													text-align: center;
													transform: rotate(-135deg);
													font-size: 22rpx;
												}
											}
										}

										&:last-of-type {
											font-size: 22rpx;
										}
									}
								}

								&:last-of-type {
									display: flex;
									align-items: center;

									&>view {
										font-size: 22rpx;
										background-repeat: no-repeat;
										background-size: contain;
										background-position: left center;
										padding-left: 45rpx;
										margin-left: 20rpx;

										&:first-of-type {
											// background-image: url("@{URL}/weixinpl/shopping-temp/images/edit.png");
										}

										&:last-of-type {
											// background-image: url("@{URL}/weixinpl/shopping-temp/images/clear1.png");
										}
									}
								}
							}
						}
					}
				}
			}
		}

		.add {
			height: 90rpx;
			border-top: 1px solid #EDEDED;
			display: flex;
			justify-content: center;
			align-items: center;
			background-color: #EC0000;
			border-top: 1px solid #f9f9f9;
			box-sizing: border-box;
				font-size: 28rpx;
				color: #fff;
		}
	}
</style>
